要對 Google slides 做進一步的操作前，再來跟大家複習一下 Google Slides 的架構

Google Slides 的架構

• Presentation (簡報): 包含多個 Slide (幻燈片)。
• Slide (幻燈片): 包含多個 PageElement (頁面元素)，如形狀和圖片。
• PageElement (頁面元素): 可以是 Shape (形狀)、Image (圖片) 等。
• Shape (形狀): 可以包含文字和其他格式。文字用 TextRange (文字範圍) 來表示。
• TextRange (文字範圍): 包含一段文字的內容，可以設置文字和段落樣式。
• ParagraphStyle (段落樣式): 用於設置段落的格式（例如對齊方式）。

今天來說說 PageElement & Shape 這兩個元素！

3. PageElement (頁面元素)

PageElement 是 Google Slides 中的一個通用類別，代表幻燈片上的任何元素。這個類別包含了所有可以放在幻燈片上的元素，包括形狀、圖片、線條等。它是這些元素的基礎類別，也就是說，所有的形狀、圖片等都繼承自 PageElement。

特點：

• 通用性：PageElement 是所有幻燈片元素的基類。無論是形狀、圖片還是線條，這些元素都被視為 PageElement。
• 基本方法：由於是基類，PageElement 提供了許多通用的方法，例如獲取元素的大小 (getWidth() 和 getHeight())、位置 (getLeft() 和 getTop())，或是刪除元素 (remove()).

example: 獲取 Slide 中的所有頁面元素，並列出它們的類型。

當你需要操作幻燈片上多種類型的元素時，可以使用 PageElement 來獲取這些元素，然後再進行具體的操作。

function listPageElements() {
  var presentation = SlidesApp.getActivePresentation();
  var slide = presentation.getSlides()[0]; // 取得第一張幻燈片
  var pageElements = slide.getPageElements(); // 取得幻燈片上的所有頁面元素
  
  for (var i = 0; i < pageElements.length; i++) {
    Logger.log(pageElements[i].getPageElementType()); // 列出每個元素的類型
  }
}

Note: 沒錯唷! 文字框也隸屬在 Shape 這個 Type 下面！

可能的 PageElementType 類型

當然！以下是可能的 PageElementType 類型，整理成 Markdown 格式的表格：

4. Shape (形狀)

Shape 是 PageElement 的一種，專門代表投影片上的形狀。Shape 很高機率被用到！因為他可以是文字框，因此讓我們也用一點篇幅來介紹一下！其他 Page Element 類型詳細可看上面的表格再去查官方手冊！

形狀可以是各種圖形，例如矩形、橢圓、箭頭，或者文字框（Text Box）。沒錯！文字框也是一種形狀，只是它專門用來包含文字。

特點：

• 特化的元素：Shape 繼承自 PageElement，所以它具有所有 PageElement 的通用方法。另外，Shape 提供了許多專門操作形狀的功能。
• 文字內容：大多數 Shape 可以包含文字。你可以使用 getText() 方法獲取形狀中的文字範圍（TextRange）。
• 形狀類型：你可以使用 getShapeType() 方法來檢查 Shape 是什麼類型（例如矩形、圓形、箭頭或文字框）。

主要用途：

• 用於操作幻燈片上的形狀，例如插入文字、設定填充顏色、調整邊框樣式，或更改形狀的位置和大小。

example: 在 Slide 中新增一個矩形，並新增文字

function addRectangleShape() {
  var presentation = SlidesApp.getActivePresentation();
  var slide = presentation.getSlides()[0]; // 取得第一張幻燈片
  var shape = slide.insertShape(SlidesApp.ShapeType.RECTANGLE, 100, 100, 300, 100); // 插入一個矩形
  shape.getText().setText('這是矩形中的文字'); // 設定形狀中的文字
}

可以調整形狀背景和文字顏色嗎？
A: 當然可以

example: 在 Slide 中新增一個橘色矩形，並新增白色文字

function addOrgRectangleShape() {
  var presentation = SlidesApp.getActivePresentation();
  var slide = presentation.getSlides()[0]; // 取得第一張幻燈片
  var shape = slide.insertShape(SlidesApp.ShapeType.RECTANGLE, 100, 100, 300, 100); // 插入一個矩形

  // 設置矩形的背景顏色
  shape.getFill().setSolidFill('#FF5733'); // 設置背景顏色為橙色

  // 插入文字並設置文字顏色為白色
  var textRange = shape.getText();
  textRange.setText('這是矩形中的白色文字');
  textRange.getTextStyle().setForegroundColor('#FFFFFF'); // 設置文字顏色為白色
}

接下來就繼續來看看 TextRange(文字範圍) 和 ParagraphStyle(段落樣式) 吧！